<template>
  <div class="box_00">
    <el-card class="box-11">
      <div calss="filler">
        <div class="title12"><h3>影片排片</h3></div>
        <div class="a12">
    <el-date-picker
      v-model="date"
      type="date"
      @change="getData"
    ></el-date-picker>
        </div>
      </div>
    </el-card>


    <div class="building99" border>
      <el-table :data="tableData" style="width: 100%">
        <el-table-column prop="rank" label="排名" width="90" />
        <el-table-column prop="filmName" label="影片名称" width="130" sortable />
        <el-table-column prop="showDays" label="上映天数" width="90" sortable />
        <el-table-column prop="type" label="影片类型" width="100" sortable />
        <el-table-column
          prop="totalSession"
          label="总场次"
          width="75"
          sortable
        />
        <el-table-column
          prop="totalCircle"
          label="总场次环比"
          width="75"
          sortable
        />
        <el-table-column
          prop="amSession"
          label="上午场次"
          width="65"
          sortable
        />
        <el-table-column
          prop="amCircle"
          label="上午场次环比"
          width="75"
          sortable
        />
        <el-table-column
          prop="pmSession"
          label="下午场次"
          width="75"
          sortable
        />
        <el-table-column
          prop="pmCircle"
          label="下午场次环比"
          width="80"
          sortable
        />
        <el-table-column
          prop="goldSession"
          label="黄金场次"
          width="65"
          sortable
        />
        <el-table-column
          prop="goldCircle"
          label="黄金场次环比"
          width="75"
          sortable
        />
        <el-table-column
          prop="addSession"
          label="加映场次"
          width="65"
          sortable
        />
        <el-table-column
          prop="addCircle"
          label="加映场次环比"
          width="75"
          sortable
        />
        <el-table-column prop="currentDate" label="日期" width="120" sortable />
      </el-table>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [],
      date: new Date("2023-03-16"),
      pageInfo: {},
      pageSize: 20,
      currentPage: 1,
    };
  },
  mounted() {
    this.getData();
  },

  methods: {
    getData() {
      const date = this.date;
      const year = date.getFullYear();
      const month = String(date.getMonth() + 1).padStart(2, "0");
      const day = String(date.getDate()).padStart(2, "0");
      const dateStr = `${year}-${month}-${day}`;
      this.$http.get("/schedule/v1/currentDate/" + dateStr).then((response) => {
        this.tableData = response.data;
        console.log(this.tableData);
      });
    },
  },
};
</script>

<style>
.box_00 {
  overflow-y: auto;
  width: 100%;
  background-color: gainsboro;
}
.building {
  width: 1200px;
  margin-left: 10px;
  margin-top: 10px;
  border-radius: 10px;
}

.box1-1 {
  /* background: url("/public/koubeibg.jpg");
background-size: cover; */
  background-color: rgb(230, 229, 229);
  overflow: auto;
  width: 100%;
}
</style>